Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

389
Views
Find element in DOM Vue js at click of another | Vue js

The problem where I have encountered difficulties is this. When a button is clicked within a row of the datatable I would like to make only one button appear in that same row. image 1

In this case the input of that row must be opened when the + or - button is clicked.

image 2

I cannot use the v-if with a generic is_visible class set to true otherwise all the inputs of the whole table are opened.

What is the exact and right method to do this. In Jquery I easily got the same result using $this for the selected button?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I would like the input of that row to be shown when the button is clicked. Here is the single line code

<td class=" p-2 d-flex">
                            <v-btn
                                class="mx-2"
                                fab
                                dark
                                small
                                color="primary"
                                @click="showTextField()"
                            >
                                <v-icon dark>
                                    mdi-plus
                                </v-icon>
                            </v-btn>
                            <v-btn
                                @click="showTextField()"
                                class="mx-2"
                                fab
                                dark
                                small
                                color="primary"
                            >
                                <v-icon dark>
                                    mdi-minus
                                </v-icon>
                            </v-btn>


                                <v-text-field
                                    class="mr-2 d-none"
                                    label="Quantity"
                                    type="number"
                                    required>
                                </v-text-field>

   </td>
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!